<template>
	<view class="content">
		<view class="page-top">
			<text>你已经获胜 ？次</text>
			<view class="page-top-img">
				<image src="../../static/logo.png" mode=""></image>
				<text>you win</text>
				<image src="../../static/logo.png" mode=""></image>
			</view>
			
		</view>
		<view class="page-bot">
			<text>出拳吧少年~</text>
			<view class="page-bot-img">
				<image src="../../static/logo.png" mode=""></image>
				<image src="../../static/logo.png" mode=""></image>
				<image src="../../static/logo.png" mode=""></image>
			</view>
			<button type="default">不服！再来</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello'
			}
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>

<style>
	.content{
		display: flex;
		flex-direction: column;
		height: 100vh;
		width: 100vw;
		background-color: #ffe411;
		
	}
	.page-top{
		height: 30vh;
		
		margin: 0 auto;
		text-align: center;
		width: 100vw;
		display: flex;
		flex-direction: column;
	}
	.page-top>text{
		margin-top: 50rpx;		
		
	}
	.page-top-img{
		display: flex;
		flex-direction: row;
		justify-content: space-around;
	}
	.page-top-img>text{
		
		height: 220rpx;
		width: 220rpx;
		margin-top: 70px;
		color: red;
	}
	.page-top-img>image{
		
		height: 220rpx;
		width: 220rpx;
		margin-top: 30px;
		border: 1px solid #808080;
	}
	.page-bot{
		height: 55vh;
		background-color: #ffffff;
		width: 90vw;
		margin: 0 auto;
		text-align: center;
		margin-top: 40rpx;
		border-radius: 10rpx;
		display: flex;
		flex-direction: column;
		
	}
	.page-bot>text{
		margin-top:50rpx;
		font-weight: 600;
	}
	.page-bot-img{
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		margin-top: 85rpx;
	}
	.page-bot>button{
		width: 55vw;
		font-weight: 600;
		margin-top: 120rpx;
		background-color: #ffe415;
	}
	.page-bot-img>image{
		height: 180rpx;
		width: 180rpx;
		border-radius: 50%;
	}
</style>
